<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>钢镚注册</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="max-age=0"/>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link type="text/css" rel="stylesheet" href="skin/css/basic.css"/>
    <script type="text/javascript" src="js/jquery-1.12.2.js"></script>
    <script type="text/javascript" src="js/localStorage.js"></script>
    <script type="text/javascript" src="js/tripledes.js"></script>
    <script type="text/javascript" src="js/mode-ecb-min.js"></script>
    <script type="text/javascript" src="js/sign.js"></script>

    <!--加载样式-->
    <script>
        $(window).load(function () {
            $("#status").fadeOut();
            $("#preloader").delay(350).fadeOut("slow");
        })
    </script>

    <script type="text/javascript">
        /**
         * 验证手机号
         * */
        function checkTelephone() {

            var telephone = $("#telephone").val();
            console.log(telephone)
            if (!checkMobile(telephone)) {
                $("#checkTelephone").html("请输入正确的手机号");
                return false;
            } else {
                $("#checkTelephone").html("");
            }

            var t = checkTp(telephone);

            if (t.response.head.status === "0") {
                $("#checkTelephone").html("");
                return true;
            } else {
                $("#checkTelephone").html(t.response.head.desc);
                return false;
            }

        }

        /**
         * 验证昵称
         */
        function checkUserName() {

            var username = $("#username").val();

            var t = checkN(username);

            if (t.response.head.status === "0") {
                $("#checkUserName").html("");
                return true;
            } else {
                $("#checkUserName").html(t.response.head.desc);
                return false;
            }

        }

        /**
         * 验证密码
         */
        function checkPassword() {

            var password1 = $("#password").val();
            var password2 = $("#password_PwdTwo").val();
            var patrn=/^(\w){8,20}$/;

            if (isNull(password1) === true || !patrn.exec(password1)) {
                $("[name='checkPassword']").html("请输入8-20个字母、数字、下划线");
                return false;
            }

            if (password1 === password2) {
                $("[name='checkPassword']").html("");
                return true;
            } else {
                $("[name='checkPassword']").html("两次密码输入不一样");
                return false;
            }

        }

        /**
         * 发送验证码
         */
        function sendSMS(x) {
            var telephone = $("#telephone").val();

            var t = sendS(telephone);
            console.log(t)
            if (t.response.head.status === "0") {
                $("#checkSMS").html("");
                settime(x);
            } else {
                $("#checkSMS").html(t.response.head.desc);
            }
        }

        /**
         * 注册
         */
        function reg() {
            var valiDateCode = $("#validateCode").val();

            if (isNull(valiDateCode) === true) {
                $("#checkSMS").html("请填写验证码");
                return;
            }
            $("#checkSMS").html("");
            if (checkTelephone() === true && checkUserName() === true && checkPassword() === true) {
                var telephone = $("#telephone").val();
                var password = $("#password").val();
                var username = $("#username").val();
                console.log(username)
                var t = regUser(telephone, password, valiDateCode, username);
                if (t.response.head.status === "0") {
                    location.href = "login.html";
                } else {
                    alert(t.response.head.desc);
                }
            } else {
                alert("请您填写正确的表格");
            }
        }

        function checkMobile(t) {
            if (!(/^1[1|2|3|4|5|6|7|8|9][0-9]\d{4,8}$/.test(t))) {
                return false;
            } else {
                return true;
            }
        }

    </script>
    <script type="text/javascript">
        var countdown = 60;

        function settime(val) {
            if (countdown == 0) {
                val.removeAttribute("disabled");
                val.value = "获取验证码";
                $(val).text("获取验证码");
                countdown = 60;
                return;
            } else {
                val.setAttribute("disabled", true);
                val.value = "重新发送(" + countdown + ")";
                $(val).text("(" + countdown + ")");
                countdown--;
            }
            setTimeout(function () {
                settime(val)
            }, 1000)
        }
    </script>

</head>

<body>
<div class="w">
    <!--页面加载 开始-->
    <div id="preloader">
        <div id="status">
            <p class="center-text">加载中…<em>网速有点不给力哦!</em></p>
        </div>
    </div>
    <!--页面加载 结束-->
    <!--header 开始-->
    <header>
        <div style="margin-top: 50px;">
            <img style="position: relative;left: 50%;width: 5.625rem;height: 5.625rem;margin-left: -2.8125rem;"
                 src="image/logo.png"/>
        </div>
    </header>
    <!--header 结束-->
    <div class="page" style="margin-top: 30px;">
        <div class="main">
            <form id="frm_login" method="post" action="">
                <div class="item item-username">
                    <input onblur="checkTelephone();" id="telephone" class="txt-input txt-username" type="text"
                           placeholder="常用手机号" value=""
                           name="telephone">
                    <span id="checkTelephone" style="color: red;"></span>
                </div>
                <div class="item item-username">
                    <input onblur="checkUserName();" id="username" class="txt-input txt-username" type="text"
                           placeholder="请输入昵称" value=""
                           name="username">
                    <span id="checkUserName" style="color: red;"></span>
                </div>
                <div class="item item-password">
                    <input onblur="checkPassword();" id="password" class="txt-input txt-password ciphertext"
                           type="password" placeholder="请输入密码"
                           name="password" style="display: inline;">
                    <span name="checkPassword" style="color: red;"></span>
                </div>
                <div class="item item-password">
                    <input onblur="checkPassword();" id="password_PwdTwo"
                           class="txt-input txt-password_PwdTwo ciphertext_PwdTwo" type="password"
                           placeholder="确认密码" name="password_PwdTwo" style="display: inline;">
                    <span name="checkPassword" style="color: red;"></span>
                </div>
                <div class="item item-captcha">
                    <div class="input-info">
                        <input id="validateCode" class="txt-input txt-captcha" type="text" placeholder="验证码"
                               autocomplete="off" maxlength="6" size="11">
                        <b class="input-close" style="display: block;"></b>
                        <button type="button" onclick="sendSMS(this);" id="captcha-img" style="line-height: 25px;">
                            发送验证码
                        </button>
                        <span id="checkSMS" style="color: red;"></span>
                    </div>
                    <div class="err-tips"> 注册即视为同意 <a target="_blank" href="javaScript:void(0)">用户服务协议</a></div>
                </div>
                <div class="ui-btn-wrap"><a class="ui-btn-lg ui-btn-primary" onclick="reg();" href="#">用户注册</a></div>
            </form>
        </div>
    </div>
</div>
</body>
</html>
